.ant-pro-global-header{
  position: relative;
  display: flex;
  align-items: center;
  height: 52px;
  
  // 响应式padding设置（贴近边界）
  padding: 0 8px;
  @media (min-width: 1920px) {
    padding-left: 12px;
    padding-right: 12px;
  }
  @media (min-width: 1280px) and (max-width: 1919px) {
    padding-left: 12px;
    padding-right: 12px;
  }
  @media (min-width: 768px) and (max-width: 1279px) {
    padding-left: 10px;
    padding-right: 10px;
  }
  @media (max-width: 767px) {
    padding-left: 8px;
    padding-right: 8px;
    
  }
  background: #376d9b;
  box-shadow:0 1px 4px rgba(61, 130, 196, 0.08);
  >*{
    height: 100%;
  }

  &-top{
    .ant-menu-horizontal >.ant-menu-submenu{
      top: unset;
    }
  }

  &-collapsed-button{
    display: flex;
    font-size: 20px;
    align-items: center;
    margin-left: 24px;
    color: #fff; // 白色图标
    
    .anticon {
      color: #fff !important; // 确保图标是白色
    }
  }

  &-logo{
    position: relative;
    overflow: hidden;
    flex-shrink: 0; // 防止logo被压缩

    a {
      display: flex;
      align-items: center;
      height: 100%;

      img {
        height: 28px;
      }
      h1{
        height: 32px;
        margin: 0 0 0 12px;
        font-weight: 600;
        font-size: 18px;
        line-height: 32px;
      }
    }
  }
  
  // 确保用户信息区域始终靠右
  .ant-space {
    flex-shrink: 0 !important;
    white-space: nowrap;
  }
  
  // 菜单区域的响应式处理
  .flex-1 {
    flex: 1;
    min-width: 0; // 允许flex项目收缩
    overflow: hidden;
    
    // 平板和移动端菜单处理
    @media (max-width: 1279px) {
      .ant-menu {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        
        // 隐藏滚动条样式
        scrollbar-width: none; // Firefox
        -ms-overflow-style: none; // IE 10+
        
        &::-webkit-scrollbar {
          display: none; // Chrome, Safari, Opera
        }
      }
    }
  }
  
  // Logo区域响应式处理
  @media (max-width: 767px) {
    .ant-pro-global-header-logo {
      h1 {
        font-size: 16px !important;
      }
      
      img {
        height: 24px !important;
      }
    }
  }
  
  // 菜单响应式字体大小
  .header-menu-responsive {
    @media (max-width: 767px) {
      font-size: 14px !important;
    }
    
    @media (min-width: 768px) and (max-width: 1279px) {
      font-size: 15px !important;
    }
  }

  &-layout-mix{
    background: #376d9b;
    .anticon {
      color:#fff;
    }
  }

  &-layout-mix &-logo{
    h1{
      color: #fff;
    }
  }
  .ant-menu-horizontal{
    border-bottom: none!important;
    height: 48px;
    line-height: 48px;
    
    // 菜单项样式
    .ant-menu-item {
      height: 48px;
      line-height: 48px;
      padding-inline: 8px;
      color: rgba(255, 255, 255, 0.7) !important; // 未选中状态：白色半透明
      border-bottom: none !important; // 移除底部边框
      
      &:hover {
        color: rgba(255, 255, 255, 0.9) !important; // 悬停状态：更不透明的白色
        border-bottom: none !important; // 悬停时也移除底部边框
        &::after {
          display: none !important; // 隐藏悬停时的下划线
        }
      }
      
      &.ant-menu-item-selected {
        color: #fff !important; // 选中状态：完全不透明的白色
        background-color: rgba(255, 255, 255, 0.1) !important; // 选中背景：轻微白色背景
        border-bottom: none !important; // 选中时移除底部边框
        &::after {
          display: none !important; // 隐藏选中时的下划线
        }
      }
      
      // 通用隐藏所有下划线
      &::after {
        display: none !important;
      }
    }
    
    // 子菜单样式
    .ant-menu-submenu {
      height: 48px;
      line-height: 48px;
      padding-inline: 8px;
      color: rgba(255, 255, 255, 0.7) !important; // 未选中状态：白色半透明
      border-bottom: none !important; // 移除底部边框
      
      &:hover {
        color: rgba(255, 255, 255, 0.9) !important; // 悬停状态：更不透明的白色
        border-bottom: none !important; // 悬停时也移除底部边框
        &::after {
          display: none !important; // 隐藏悬停时的下划线
        }
      }
      
      &.ant-menu-submenu-selected {
        color: #fff !important; // 选中状态：完全不透明的白色
        border-bottom: none !important; // 选中时移除底部边框
        &::after {
          display: none !important; // 隐藏选中时的下划线
        }
      }
      
      // 通用隐藏所有下划线
      &::after {
        display: none !important;
      }
    }
  }


  &-inverted{
    --hover-color:rgb(42, 44, 55);
    color: rgba(229, 224, 216, 0.85);
    background: #FFFFFF;
    box-shadow:0 1px 4px rgba(0,21,41,.08);

    .ant-pro-top-nav-header{
      &-logo{
        h1{
          color: rgb(229, 224, 216);
        }
      }
    }
  }
}

// 侧边栏菜单样式
.ant-pro-sider-menu {
  .ant-menu-item {
    color: #303030 !important; // 未选中状态：深红色
    border-bottom: none !important; // 移除底部边框
    
    &:hover {
      color: #000000 !important; // 悬停状态：黑色
      border-bottom: none !important; // 悬停时也移除底部边框
      &::after {
        display: none !important; // 隐藏悬停时的下划线
      }
    }
    
    &.ant-menu-item-selected {
      color: #000000 !important; // 选中状态：黑色
      background-color: transparent !important; // 选中背景：透明
      border-bottom: none !important; // 选中时移除底部边框
      &::after {
        display: none !important; // 隐藏选中时的下划线
      }
    }
    
    // 通用隐藏所有下划线
    &::after {
      display: none !important;
    }
  }
  
  .ant-menu-submenu {
    color: #3a3a3a !important; // 未选中状态：深红色
    border-bottom: none !important; // 移除底部边框
    
    &:hover {
      color: #000000 !important; // 悬停状态：黑色
      border-bottom: none !important; // 悬停时也移除底部边框
      &::after {
        display: none !important; // 隐藏悬停时的下划线
      }
    }
    
    &.ant-menu-submenu-selected {
      color: #000000 !important; // 选中状态：黑色
      border-bottom: none !important; // 选中时移除底部边框
      &::after {
        display: none !important; // 隐藏选中时的下划线
      }
    }
    
    // 通用隐藏所有下划线
    &::after {
      display: none !important;
    }
    
    .ant-menu-submenu-title {
      color: #313131 !important; // 子菜单标题：深红色
      border-bottom: none !important; // 移除底部边框
      
      &:hover {
        color: #000000 !important; // 悬停状态：黑色
        border-bottom: none !important; // 悬停时也移除底部边框
        &::after {
          display: none !important; // 隐藏悬停时的下划线
        }
      }
      
      // 通用隐藏所有下划线
      &::after {
        display: none !important;
      }
    }
  }
}

.ant-pro-top-nav-header-logo{
  position: relative;
  min-width: 165px;
  height: 100%;
  overflow: hidden;
  margin-right: 25px;

  img{
    display: inline-block;
    height: 32px;
    vertical-align: middle;
  }

  h1{
    display: inline-block;
    margin: 0 0 0 12px;
    font-size: 16px;
    vertical-align: top;
    color: rgba(0,0,0,.85);
  }
}


[data-theme='dark'] .ant-pro-top-nav-header-logo{
  h1{
    color: rgba(229, 224, 216, 0.85);
  }
}

[data-theme='dark'] .ant-pro-global-header{
  background: #FFFFFF;
  box-shadow:rgba(13, 13, 13, 0.65) 0px 2px 8px 0px;

  &-layout-mix {
    background: rgb(15, 28, 41);

    .anticon {
      color:rgb(229, 224, 216);
    }

    .ant-pro-global-header{
      &-logo{
        h1{
          color: rgb(229, 224, 216);
        }
      }
    }
  }

  &-layout-top,&-layout-side{
    background-color: rgb(36, 37, 37);
  }


}
